@login: legions-main;

.@{login}{
    position : absolute;
    width: 100%;
    height: 100%;
    background-color: #EFF4FF;
    overflow: hidden;
    flex-direction: column;
    display: flex;
    .header{
        width: 100%;
        height: 189px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        background: linear-gradient(180deg, #D9E5FF 0%, #EFF4FF 100%);
        .title{
            margin-left: 32px;
            height: 67px;
            width: 192px;
            margin-top: 69px;
            font-size: 48px;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: #2F2F2F;
            line-height: 67px;
        }
        .desc{
           width: 268px;
           height: 189px; 
           margin-right: 18px;
           .img{
            width: 268px;
            height: 189px;
          }
        }
    }
    .content{
        height: 504px;
        display: flex;
        flex-direction: row;
        margin-left: 32px;
        margin-right: 16px;
        .block{
            width: 331px;
            height: 108px;
            border-radius: 8px;
        }
        .text{
            width: 128px;
            height: 45px;
            font-size: 32px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #2D2E2E;
            line-height: 108px;
            position: relative;
            left: 24px;
            .badge{
                width: 58px;
                height: 36px;
                background: #FFFFFF;
                border-radius: 18px;
                font-size: 24px;
                font-family: PingFangSC-Medium, PingFang SC;
                font-weight: 500;
                color: #FF2A2A;
                margin-left: 19px;
                padding: 2px 7px;
            }
        }
        .left{
            height: 504px;
            display: flex;
            flex-direction: column;
            .proj{
                width: 331px;
                height: 240px;
                background: linear-gradient(180deg, #BDEBFE 0%, #86CFFE 100%);
                border-radius: 8px;
                display: flex;
                flex-direction: row;
                .title{
                    margin-left: 24px;
                    margin-top: 31px;
                    width: 128px;
                    font-size: 32px;
                    font-family: PingFangSC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #2D2E2E;
                }
                .backgroud{
                  margin-top: 52px;
                  width: 179px;
                  height: 188px;
                  background-image:url('https://hoolinks-frontend-resources.oss-cn-shenzhen.aliyuncs.com/images/weapp-proj.png');
                  background-size: 179px 188px;
                }
            }
            .mr-apply{
                background: linear-gradient(270deg, #B4D3FE 0%, #C0E3FE 100%);
                margin-top: 24px;
            }
            .cr-mr-apply{
                background: linear-gradient(270deg, #6FDDB3 0%, #86F3B9 100%);
                margin-top: 24px;
            }
        }
        .right{
            height: 504px;
            display: flex;
            flex-direction: column;
            width: 331px;
            margin-left: 24px;
            .rollback{
                background: linear-gradient(270deg, #B4D3FE 0%, #C0E3FE 100%);
            }
            .deploy{
                background: linear-gradient(270deg, #86CFFE 0%, #BDEBFE 100%);
                margin-top: 24px;
            }
            .branch{
                background: linear-gradient(270deg, #FFCDAC 0%, #FBDDBE 100%);
                margin-top: 24px;
            }
            .my{
                background: linear-gradient(140deg, #E3CFFF 0%, #D8ACFF 100%);
                margin-top: 24px;
            }
        }
    }
}
